// Learn TypeScript:
//  - https://docs.cocos.com/creator/manual/en/scripting/typescript.html
// Learn Attribute:
//  - https://docs.cocos.com/creator/manual/en/scripting/reference/attributes.html
// Learn life-cycle callbacks:

import BaseView from "../base/BaseView";
import ColorConfig from "./models/ColorConfig";
import ColorItem from "./items/ColorItem";

var Colors = [
    cc.color(180,180,180),
    cc.color(255,255,0),
    cc.color(227,207,87),
    cc.color(255,153,18),
    cc.color(235,142,85),
    cc.color(255,215,0),
    cc.color(255,97,0),
    cc.color(245,222,179),
    cc.color(176,224,230),
    cc.color(65,105,225),
    cc.color(106,90,205),

    cc.color(127,255,212),
    cc.color(64,224,208),
    cc.color(46,139,87),
    cc.color(0,255,127),
    cc.color(153,51,250),
    cc.color(218,112,214),
    cc.color(221,160,221),
    cc.color(115,74,18),
    cc.color(210,180,140),
    cc.color(244,164,96),

    cc.color(0,201,87),
    cc.color(50,205,50),
    cc.color(163,148,128),
    cc.color(163,148,128),
];

const {ccclass, property} = cc._decorator;

@ccclass
export default class LookNodeView extends BaseView {

    @property(cc.Node)
    colorsNode: cc.Node = null;

    @property(cc.Label)
    nameLabel: cc.Label = null;

    _selectIndex: number = 0;

    nodeInfo: any = null;

    onLoad () {
        let children = this.colorsNode.children;
        for (let index = 0; index < children.length; index++) {
            const child = children[index];
            let color = Colors[index];
            if (color == null) {
                return;
            }
            child.getComponent(ColorItem).setColor(color, index);
            child.getComponent(ColorItem).setClickCallback((index)=>{
                this.onColorSelect(index);
            });
        }
    }

    onColorSelect (index: number) {
        this._selectIndex = index;
    }

    show (stockInfo) {
        super.show(stockInfo);
        this.nameLabel.string = stockInfo.name;
        this.node.active = true;
        this.nodeInfo = stockInfo;
        let ts_code = stockInfo.ts_code;
        let config = ColorConfig.getModule();
        let color = config.getColor(ts_code);
        for (let index = 0; index < Colors.length; index++) {
            let color2 = Colors[index];
            const child = this.colorsNode.children[index];
            if (color2.r == color.r && color2.g == color.g && color2.b == color.b) {
                child.getComponent(cc.Toggle).check();
                break;
            }
        }
    }

    onBtnSaveColor () {
        let color = Colors[this._selectIndex];
        let config = ColorConfig.getModule();
        config.setConfigItem(this.nodeInfo.ts_code, color);
        config.publish();
        this.hide();
    }

    onBtnLookRank () {
        this.createDialog(BaseView.Views.RankTrendView, this.nodeInfo, true);
        this.hide();
    }

    // update (dt) {}
}
